<template>
  <div class="home">
        <el-button @click="goDetail">跳转</el-button>
    <div class="test">132</div>
    <dir class="bg bg-red-50">1313</dir>
    <img alt="Vue logo" src="../assets/logo.png">
    <HelloWorld msg="Welcome to Your Vue.js + TypeScript App"/>
  </div>
</template>

<script lang="ts">
import HelloWorld from '@/components/HelloWorld.vue' // @ is an alias to /src
import { defineComponent } from 'vue'
import { useRouter } from 'vue-router'
export default defineComponent({
  setup: () => {
    const router = useRouter()
    const goRouter = (name: string) => {
      router.push(name)
    }
    return {
      goRouter
    }
  },
  data () {
    return {
      key: ''
    }
  },
  components: {
    HelloWorld
  },
  methods: {
    goDetail () {
      // const router = useRouter()
      // this.$test()
      this.$message('13313')
      this.$router.push({
        path: '/about',
        query: {
          test: 'test'
        }
      })
    }
  }
})
</script>
